import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:note/widgets/BasePage.dart';
import 'package:note/common/common.dart';
import 'logic.dart';

class SetAppPage extends StatelessWidget {
  SetAppPage({Key? key}) : super(key: key);

  final logic = Get.put(SetAppLogic());
  final state = Get.find<SetAppLogic>().state;

  @override
  Widget build(BuildContext context) {
    return BasePage(
      child: GestureDetector(
        onTap: logic.cancelFocus,
        child: Scaffold(
          appBar: AppBar(
            backgroundColor: Styles.backgroundColor,
            foregroundColor: Styles.mainThemeColor,
            title: const Text(Strings.setApp),
            actions: [
              IconButton(onPressed: logic.onSave, icon: const Icon(Icons.save))
            ],
          ),
          body: Form(
            child: SingleChildScrollView(
              child: Column(
                children: [
                  //背景
                  GestureDetector(
                    onTap: logic.onSelectBG,
                    child: Obx(() {
                      return Container(
                          height: 200,
                          width: MediaQuery.of(context).size.width,
                          decoration: const BoxDecoration(
                            color: Styles.backgroundColor,
                          ),
                          child: state.bgImg.value.existsSync()
                              ? Image(
                                  image: FileImage(state.bgImg.value),
                                  fit: BoxFit.cover,
                                )
                              : const Center(
                                  child: Icon(
                                    Icons.photo_camera_back,
                                    size: 100,
                                    color: Styles.mainThemeColor,
                                  ),
                                ));
                    }),
                  ),
                  //名称
                  Padding(
                    padding: const EdgeInsets.fromLTRB(15, 10, 15, 10),
                    child: TextFormField(
                      controller: state.nameController,
                      focusNode: state.nameFocus,
                      textInputAction: TextInputAction.done,
                      maxLines: 1,
                      maxLength: 20,
                      decoration: InputDecoration(
                          hintText: Strings.setUserNameHint,
                          labelText: Strings.userNameTitle,
                          icon: const Icon(Icons.account_circle_outlined),
                          iconColor: Styles.mainThemeColor,
                          focusColor: Styles.mainThemeColor,
                          suffixIconColor: Styles.mainThemeColor,
                          suffixIcon: IconButton(
                            icon: const Icon(Icons.cancel_outlined),
                            onPressed: logic.onCleanName,
                          )),
                    ),
                  ),
                  GestureDetector(
                    onTap: logic.onDeleteBG,
                    child: Container(
                      width: 150,
                      height: 50,
                      alignment: Alignment.center,
                      decoration: BoxDecoration(
                          color: Styles.backgroundColor,
                          borderRadius:
                              const BorderRadius.all(Radius.circular(20)),
                          boxShadow: const [
                            BoxShadow(color: Styles.shadowColor, blurRadius: 10)
                          ],
                          border: Border.all(color: Styles.mainThemeColor)),
                      child: Text(
                        '删除背景图',
                        style: Styles.textThemeMedium(15),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}
